<!DOCTYPE html>
<html>
  <head>
    <title>From Objects</title>
    <link href="https://fonts.googleapis.com/css?family=Lato|Roboto|Source+Code+Pro" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.15.6/styles/monokai.min.css">
    <link rel="stylesheet" href="demo.css">
  </head>

  <body>

    <div id="header">
      <h1 id="title">$.csv.fromObjects()</h1>
      <div id="link"><a href="https://github.com/typeiii/jquery-csv">GitHub</a></div>
    </div>
    <div id="container">
      <section id="content">
        <h2>Description</h2>
        <p>Used to format an array of structured objects as CSV.</p>
        <hr>
        <h2>Usage</h2>
        <pre><code class="javascript">var result = $.csv.fromObjects(input);</code></pre>
        <hr />
        <h2>Input</h2>
        <textarea id="input" style="height: 320px;">
[
  {
    "ID":"1",
    "iManufacturer":"Evans & Sutherland",
    "iMPartNumber":"230-132-111AA",
    "iSimCategory":"Visual",
    "iPartType":"PCB",
    "iGroup":"1",
    "iLocation":"Offsite"
  },
  {
    "ID":"2",
    "iManufacturer":"Evans & Sutherland",
    "iMPartNumber":"230-132-111AA",
    "iSimCategory":"Visual",
    "iPartType":"PCB",
    "iGroup":"1",
    "iLocation":"Offsite"
  }
]
        </textarea>
        <input id="run" type="button" value="Run" />
        <hr />
        <h2>Result</h2>
        <textarea id="result" style="height: 65px;"></textarea>
      </section>
    </div>

    <script src="http://code.jquery.com/jquery-3.3.1.slim.js" integrity="sha256-fNXJFIlca05BIO2Y5zh1xrShK3ME+/lYZ0j+ChxX2DA=" crossorigin="anonymous"></script>
    <script src="../src/jquery.csv.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.15.6/highlight.min.js"></script>
    <script>
      // enable syntax highlighting
      hljs.initHighlightingOnLoad();

      $(document).ready(() => {
        format();
      });

      $('#run').bind('click', function () {
        format();
      });

      function format() {
        const input = JSON.parse($('#input').val());
        const csv = $.csv.fromObjects(input);
        $('#result').empty();
        $('#result').html(csv);
      }
    </script>
  </body>
</html>